<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			#d1{
				height: 400px;
				width: 500px;
				border: 20px groove red;
			}
			.on{
				background-image: url(../day8/dangdang2/images/mai.jpg);
				background-repeat: no-repeat;
				background-position: center;
				font-size: 64px;
				border-radius: 50%;
			}
			.off{
				background: none;
				font-size: 14px;
				border-radius: 0;
			}
		</style>
		<script>
			function changeDiv(){
				d1=document.getElementById("d1");
				d1.className="on";
//				d1.style.fontSize="60px";
//				d1.style.fontFamily="叶根友毛笔行书输入法2.0版";
//				d1.style.background="url(../day8/dangdang2/images/mai.jpg) center no-repeat";
			}
			function clearDiv(){
				d1=document.getElementById("d1");
				d1.className="off";
				//d1.style.fontSize="14px";
				//d1.style.background="none";
				//
			}
			function hideDiv(t){
				if(t.value=="显示"){
				d1=document.getElementById("d1");
				d1.style.display="block";
				t.value="隐藏";
				}
				else if(t.value=="隐藏"){
				d1=document.getElementById("d1");
				d1.style.display="none";
				t.value="显示";
				}
				
				
			}
		</script>
	</head>
	<body>
		<div id="d1" onmouseover="changeDiv()" onmouseout="clearDiv()">
			We change lives
		</div>
		<input type="button" value="隐藏" onclick="hideDiv(this)"/>
	</body>
</html>
